<template>
    <div class="indexym">
      <div class="ques">
        <h2 style="text-align:center">{{ info.title }}</h2>
        <div style="color:rgb(102, 102, 102);text-align:center;margin-bottom:20px;">发布时间:{{ info.createTime }}</div>
        <div style="color:rgb(102, 102, 102);text-align:center;margin-bottom:20px;">发布人:{{ info.modifyBy }}</div>
        <div class="ai-abstract" style="width: 100%;padding: 10px;margin-bottom: 10px;">
          <div v-html="info.content"></div>
        </div>
  
     
  
      </div>
    </div>
  </template>
  <style scoped>
  .ai-abstract {
    box-sizing: border-box;
    padding: 8px 16px;
    /* background: url("../assets/xz.png") 100% 100%; */
  
    border-radius: 8px;
  }
  </style>
  <script>
  import service from '@/request';
  
  import E from 'wangeditor';
  export default {
    data() {
      return {
        info: {},
        form: {},
        total: 0,
        commentlist: [],
        comment: "",
        comment1: "",
        receive: "",
        receive1: "",
        receive3: "",
        fromVisible: false
      }
    },
    mounted() {
      this.token = window.localStorage.getItem("token")
      this.user = JSON.parse(window.localStorage.getItem("userinfo"))
      this.getdata()
      
    },
    methods: {
      pl(id) {
        this.parentId = id;
        this.fromVisible = true;
        this.comment1 = ""
      },
      async submit() {
        const res = await service.post("/comment", {
          userId: this.user.id,
          content: this.comment,
          forumId: this.$route.query.id,
          parentId: this.parentId == '' ? this.parentId : 0
        });
        this.comment = ""
      
      },
      del(id) {
        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {
          const res = await service.delete("/comment/" + id)
          console.log(res)
          if (res.code == 200) {
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
          
          }
  
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
     
  
      write(id) {
        this.form = {};
        this.form.questionId = id;
        this.fromVisible = true;
        setTimeout(() => {
          this.initWangEditor("")
        }, 2000)
  
      },
      async save() {
  
        this.form.userId = this.user.id
  
  
  
        const res = await service.post("/comment", {
          userId: this.user.id,
          content: this.comment1,
          forumId: this.$route.query.id,
          parentId: this.parentId
        });
        if (res.code == 200) {
          this.fromVisible = false
        this.$message({
                    type: 'success',
                    message: '操作成功',duration:1000
                });
       
        }
  
  
  
  
      },
      initWangEditor(content) { //用户输入的文本作为参数传进函数。
        this.$nextTick(() => { //1.dom元素加载好后，先判断editor是否已经完成初始化，如果已经完成初始化，那么把editor销毁，清空。
          if (this.editor) {
            this.editor.destroy();
            this.editor = null;
          }
          this.editor = new E('#editor') //2.新建一个editor，赋值给我们一开始定义的editor，并渲染在iD为#editor的元素里
          this.editor.config.placeholder = '请输入内容' // 配置编辑器默认展示的文本
          this.editor.config.uploadFileName = 'file' //配置编辑器文件上传的名称
           this.editor.config.uploadImgServer = '/oss/editor'  //配置编辑器文件上传的接口
                this.editor.config.uploadImgHeaders = {
                    Authorization: 'Bearer ' + localStorage.getItem('token') // 设置请求头
                }  //配置编辑器文件上传的接口
          this.editor.create() //执行创建编辑器
          console.log("12345")
          setTimeout(() => { //延时函数，这里没有设置延时时间，即为实时获取编辑器的文本给到this.editor.txt.html()。
            this.editor.txt.html(content)
          })
  
        })
      },
      async getdata() {
        const res = await service.get("/notice/" + this.$route.query.id);
        console.log(res)
        this.info = res.data
    
  
      }
    }
  }
  </script>
  <style scoped>
  .flex {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    color: rgb(136, 136, 136);
    font-size: 14px;
  }
  
  .ques {
    width: 70%;
    height: auto;
    padding: 10px;
    box-sizing: border-box;
    background: #fff;
    margin: 0 auto;
  }
  
  .indexym {
    width: 100%;
    height: calc(100% - 61px);
  
    background-color: rgb(248, 248, 248);
  }
  
  .ans {
    width: 70%;
    height: auto;
    padding: 10px;
    box-sizing: border-box;
    background: #fff;
    margin: 10px auto;
  }
  
  .antitle {
    font-size: 20px;
    margin-bottom: 10px;
  }
  
  .commentylist {
    width: 100%;
    height: auto;
  
  }
  </style>